var imgWidth=640;
var srcWidth=640;
var srcHeight=420;
var realWidth = null;
var realHeight = null;

function headImgUpload (){
    $("#imageFile").trigger('click');
}

function previewImage (fileObj) {
    if(fileObj.value == null || fileObj.value == '') {
        return;
    }
    submitImageUploadForm();
}

function submitImageUploadForm () {
    var form = $("#imageUploadForm");
    var options  = {
        url: appPath + "/popup/file_upload",
        success: sendImage
    };
    form.ajaxSubmit(options);
}

function sendImage (datas) {
    if (!datas.result) {
        alert(datas.errorMsg);
        return;
    }
    $("#selectImage").addClass("nav1");
    $("#cutImgDetal").removeClass("nav1");
    $("#imageFile").val("");

    $("#fileUrl").val(datas.fileUrl);
    $("#fid").val(datas.fid);
    $("input[name=varFileName]").val(datas.varFileName);
    var bigImg = $(".bigImg");
    bigImg.empty();
    var img = new Image();
    img.src = datas.fileUrl;
    img.id = "srcImg";

    // 图片加载成功后才进行组件初始化，防止找不到图片的真实宽高
    $(img).load(function() {
        realWidth = img.width;
        realHeight = img.height;

        /*if(img.width>=imgWidth) {
            img.height = (img.height * imgWidth) / img.width;
            img.width = imgWidth;
        }*/
        img.width = 640;
        img.height = 420;

        /*srcWidth = img.width;
        srcHeight = img.height;*/

        bigImg.append(img);
        initImage(img);

        $(".jcrop-holder").each(function() {
            $(this).css("text-align", "center");
            $(this).css("margin", "0 auto");
        });
    });
}

/**
 * 初始化头像剪切组件
 * @param img
 */
function initImage(img){
    var api = $.Jcrop('#srcImg',{
        onChange: showPreview,
        onSelect: showPreview,
        keySupport: false,
        allowSelect: true,
        allowResize:true,
        /*aspectRatio:1.78,*/
        cornerHandles:false,
        sideHandles:false,
        dragEdges:false
    });
    // 设置默认选中区域
    /*var maxWidth = Number(img.width);
    var maxHeight = Number(img.height);*/
    var maxWidth = Number(640);
    var maxHeight = Number(420);

    /*var x, y,w, h;
    if ( maxWidth >= maxHeight ) {
        y = 1;
        x = (maxWidth - maxHeight) / 2;
        w = maxHeight - 2;
        h = maxHeight - 2;
    } else {
        y = (maxHeight - maxWidth) / 2;
        x = 1;
        w = maxWidth - 2;
        h = maxWidth - 2;
    }*/
    //api.animateTo([120, 65, 120+248, 65+139]);
    api.setSelect([0, 0, maxWidth, maxHeight]);
}

/**
 * 动态记录坐标图片选中区域
 * @param obj
 */
function showPreview(obj) {
    var srcImg = $("#srcImg");
    //var persentX = realWidth / srcWidth;
    //var persentY = realHeight / srcHeight;

    $("#x").val(Math.round(obj.x));
    $("#y").val(Math.round(obj.y));
    $("#w").val(Math.round(obj.w));
    $("#h").val(Math.round(obj.h));
}

/**
 * 切图处理
 */
function imgChange() {
    if ($("#w").val() == 0 || $("#h").val() == 0) {
        alert("请选择头像区域");
        return;
    }

    $.ajax({
        url: appPath + "/img/img_cut",
        dataType:"json",
        async: true,
        type: "POST",
        data:$("#crop_form").serializeArray(),
        success:function(datas){
            if ( datas.result == "success" ) {
                $("#showHeaderImg").attr("src", datas.headerImage);
                $("input[name=varFid]").val(datas.varFid);
                var imageInfo = {"fileId":datas.varFid,"fileName":$("#varFileName").val()};
                $("#msgCover").val(JSON.stringify(imageInfo));
                $("#cutImgDetal").addClass("nav1");
                $("#selectImage").removeClass("nav1");
            } else {
                alert(datas.errMsg);
            }
        }
    });
}

function imgCanel(){
    $.ajax({
        url: appPath + "/img/img_delete",
        dataType:"json",
        async: true,
        type: "POST",
        data:$("#crop_form").serializeArray(),
        success:function(datas){
            $("#cutImgDetal").addClass("nav1");
            $("#selectImage").removeClass("nav1");
        }
    });
}